<template>
  <div class="table-wrapper">
    <ms-table ref="dataTable" :table-props="tableProps" :data-api="dataUrl">
      <el-table-column slot="tool" label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleOpenDialog(scope.row.tableName)"
          >
            配置
          </el-button>
          <el-button
            size="mini"
            @click="showBaseForm(scope.row.tableName)"
          >
            类配置
          </el-button>
          <el-button
            size="mini"
            @click="handleOpenDraw(scope.row.tableName)"
          >
            绘制页面
          </el-button>
        </template>
      </el-table-column>
    </ms-table>
    <draw-form :draw-dialog-visible.sync="drawDialog" :form-id="formId" />
    <form-config ref="infoForm" :title="title" :form-id="formId" :dialog-visible="dialog1" @dataFresh="handleCanleDialog" @close="handleCanleDialog" />
    <base-conf ref="baseForm" :dialog-visible.sync="baseFormDialog" :form-id="formId" />
  </div>
</template>

<script>
// components
import { MsTable } from '@/common/table'
import BaseConf from './config/baseConf'
import FormConfig from './config'
import DrawForm from '@/views/index/Home'

// mixins
import common from '@/mixins/common'

// api
import { genCode } from '@/api/generCode'
import { mockPost } from '@/utils/axios'
export default {
  components: {
    MsTable,
    FormConfig,
    DrawForm,
    BaseConf
  },
  mixins: [common],
  data() {
    return {
      tableProps: [
        { index: 'tableName', label: '表名称' },
        { index: 'tableComment', label: '备注' }
      ],
      dataUrl: '/gengerCode/list',
      drawDialog: false,
      // 类配置
      baseFormDialog: false,
      ruleForm: {
        questions: {}
      }
    }
  },
  computed: {
    mainTitle() {
      return this.formId
    }
  },
  methods: {
    handleOpenDraw(tableName) {
      this.formId = tableName
      this.drawDialog = true
    },
    showBaseForm(formId) {
      this.formId = formId
      this.baseFormDialog = true
    },
    handleClickGenCode(tableName) {
      genCode(tableName).then(res => {
        this.$notify({
          title: '等待文件下载',
          type: res.state ? 'success' : 'error',
          duration: 2500
        })
        if (res.state) {
          const values = [
            {
              key: 'path',
              value: res.obj
            },
            {
              key: 'fileName',
              value: '代码压缩.zip'
            },
            {
              key: 'zip',
              value: true
            }
          ]
          mockPost('/sys/file/downFile', values)
        }
      })
    }
  }
}
</script>

<style lang="stylus">
  .table-wrapper {
    width 80%
    margin 0 auto
  }
</style>
